<template>
    <div class="check">
        <pre-image></pre-image>
        <Ope
            :ifAdd="false"
            :ifDel="true"
            delFun="delData"
            @delData="delData"
        ></Ope>
        <el-table
            :data="tableData"
            style="width: 100%"
            border
        >
            <el-table-column
                type="expand"
            >
                <template slot-scope="props">
                    <el-form label-position="left">
                        <el-form-item
                            v-for="(item, index) in allInfo"
                            :key="index"
                            :label="item.label"
                        >
                            <span v-if="item.type !== 'image'" style="color: #333">{{ item.value }}</span>
                            <img v-if="item.type === 'image'" class="pre-image" :src="item.value"  style="width:100px;" alt="">
                        </el-form-item>
                        <el-form-item>
                            <el-button type="text" >允许通过</el-button>
                            <el-button type="text" @click="refuse">拒绝通过</el-button>
                        </el-form-item>
                    </el-form>
                </template>
            </el-table-column>

            <el-table-column
                type="index"
            ></el-table-column>

            <el-table-column
                prop="userAvatar"
                label="用户头像"
            ></el-table-column>

            <el-table-column
                prop="userName"
                label="用户昵称"
            ></el-table-column>

            <el-table-column
                prop="kindName"
                label="认证分类"
            ></el-table-column>

            <el-table-column
                prop="submitTime"
                label="提交时间"
            ></el-table-column>

        </el-table>
        <el-dialog
            title="请填写审核未通过的理由"
            :visible.sync="ifRefuseReason"
        >
            <el-input v-model="refuseReason" placeholder="填写未通过的理由以便通知用户"></el-input>
            <el-button type="primary" style="margin: 20px 0 0 0;" @click="confirm">确定</el-button>
        </el-dialog>
    </div>
</template>

<script>
import PreImage from 'template/PreImage'
import Ope from 'template/Ope'
export default {
    components: {
        PreImage,
        Ope
    },
    name: 'Check',
    data () {
        return {
            ifRefuseReason: false,
            tableData: [1],
            refuseReason: '',
            allInfo: [{
                label: '姓名',
                value: '党尼玛',
                type: 'text'
            }, {
                label: '性别',
                value: '男',
                type: 'enum',
            }, {
                label: '身份证正面',
                value: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=1764520101,2631908780&fm=85&app=52&f=JPEG?w=121&h=75&s=C813CF14414A64EA4A545DC20300E0B2',
                type: 'image'
            }]
        }
    },
    methods: {
        confirm () {
            this.ifRefuseReason = false;
        },
        delData () {
            console.log("删除所有")
        },
        refuse () {
            this.ifRefuseReason = true;
        }
    }
}
</script>

<style lang="stylus" scoped>
    .check
        width 100%
</style>


